<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>审核日志</title>
    <link rel="stylesheet" href="../../../lib/element-ui/theme-chalk/index.css">
    <link rel="stylesheet" href="../../../lib/vxe-table/index.css">
    <link rel="stylesheet" href="../../../lib/vxe-table-plugin-element/style.css">
    <script src="../../../lib/vue/vue.js"></script>
    <script src="../../../lib/xe-utils/xe-utils.js"></script>
    <script src="../../../lib/xe-ajax/xe-ajax.js"></script>
    <script src="../../../lib/element-ui/index.js"></script>
    <script src="../../../lib/vxe-table/index.js"></script>
    <script src="../../../lib/vxe-table-plugin-element/index.js"></script>
    <script src="../../../lib/element-ui/locale/lang/zh-CN.js"></script>
    <script src="../../../lib/vxe-table/locale/lang/zh-CN.min.js"></script>
    <script src="../../../static/js/jquery.min.js"></script>
    <script src="../../../static/js/webApi.js"></script>
</head>
<body>
<el-container id="app">
    <el-main style="width: 100%;">
        <el-tabs type="border-card">
            <el-tab-pane label="审核进度">
                <img id="procImage" :src="procImage" border="0" />
            </el-tab-pane>
            <el-tab-pane label="当前审核状态">
                <img id="currentTaskImage" :src="currentTaskImage" border="0" />
            </el-tab-pane>
            <el-tab-pane label="审核日志">
                <vxe-grid
                        border
                        stripe
                        ref="xGrid"
                        resizable
                        show-overflow
                        highlight-current-row="true"
                        keep-source
                        size="small"
                        height="100%"
                        :data="tableData"
                        >
                    <vxe-table-column type="seq" title="序号" width="60" align="center"></vxe-table-column>
                    <vxe-table-column field="taskName" title="状态名称" width="250"></vxe-table-column>
                    <vxe-table-column field="userName" title="审核人姓名" width="120"></vxe-table-column>
                    <vxe-table-column field="checkDateTime" title="审核时间" width="140"></vxe-table-column>
                    <vxe-table-column field="message" title="审核意见" width="300"></vxe-table-column>
                </vxe-grid>
            </el-tab-pane>
        </el-tabs>
    </el-main>
</el-container>
<script type="text/javascript">
    function getParam(name) {
        return location.href.match(new RegExp('[?#&]' + name + '=([^?#&]+)', 'i')) ? RegExp.$1 : '';
    }
    window.onload = function () {
        let procInstId = getParam('procInstId');
        let main = {
            data() {
                return {
                    tableData: [],
                    procImage: `${curlFinance}/process/image/0/${procInstId}`,
                    currentTaskImage: `${curlFinance}/process/image/1/${procInstId}`
                }
            },
            created () {
                XEAjax.get(`${curlFinance}/process/taskComment?procInstId=${procInstId}`).then(res=>{
                    this.tableData = res.data;
                })
            }
        };
        let vue = Vue.extend(main);
        new vue().$mount('#app');
    }
</script>

</body>
</html>
